const path = require('path')

/**
 * 如果你碰到了问题，请将路由导航至 /webpack-dev-server 将会为你展示服务文件的位置。
 * 例如： http://localhost:9000/webpack-dev-server
 */

module.exports = (name, proxy) => {
  const port = Number.parseInt(process.env.port || '3000', 10)
  const host = '0.0.0.0'
  return {
    // qinkun 是根据 fetch 获取到所有的脚本信息，必须允许资源信息跨域
    headers: {
      'Access-Control-Allow-Origin': '*',
      'Access-Control-Allow-Methods': '*',
      'Access-Control-Allow-Headers': '*',
    },
    // gzip
    compress: true,
    static: {
      directory: path.posix.join(__dirname, name, 'public'),
      publicPath: `${name}`
    },
    // 端口
    port,
    // 主机
    host,
    // 热模块替换
    hot: true,
    // 主动打开页面
    open: true,
    // 代理信息
    proxy: proxy || [],
    historyApiFallback: {
      rewrites: [
        // 定位：当路径为 / 时，找到 /index.html 文件
        { from: /^\/$/, to: `/index.html` },
        // 定位：当找不到路径时，回到 /index.html 文件
        { from: /./, to: '/index.html' }
        // { from: /^\/subpage/, to: '/views/subpage.html' },
        // { from: /./, to: '/views/404.html' },
      ]
    },
    // 提供在服务器内部执行所有其他中间件之前执行自定义中间件的能力。 这可以用来定义自定义处理程序
    setupMiddlewares(middlewares, devServer) {
      if (!devServer) {
        throw new Error('webpack-dev-server is not defined');
      }
      const app = devServer.app

      // 如果你想在所有其他中间件之前运行一个中间件或者当你从 `onBeforeSetupMiddleware` 配置项迁移时，
      // 可以使用 `unshift` 方法

      // 如果你想在所有其他中间件之后运行一个中间件或者当你从 `onAfterSetupMiddleware` 配置项迁移时，
      // 可以使用 `push` 方法

      return middlewares
    }
  }
}